﻿@using Smartstore.Admin.Models.Modularity

@model ProviderModelCollection

@{
    var clientRes = new Dictionary<string, string>
    {
        ["deactivate"] = T("Admin.Common.Deactivate"),
        ["active"] = T("Common.Active"),
        ["activate"] = T("Admin.Common.Activate"),
        ["inactive"] = T("Common.Inactive"),
    };
}

@{
    async Task ActiveLabel(ProviderModel item)
    {
        if (item is IActivatable activatable)
        {
            <span class="module-signal bg-warning" attr-class='(!activatable.IsActive, "d-none")' title="@T("Common.Active")"></span>
        }
    }

    bool IsActive(ProviderModel item)
    {
        var activatable = item as IActivatable;
        if (activatable == null)
        {
            return true;
        }

        return activatable.IsActive;
    }

    object RenderTemplate(object template)
    {
        var result = template as HelperResult;
        if (result != null)
        {
            result.WriteTo(Html.ViewContext.Writer, HtmlEncoder.Default);
        }
        return null;
    }
}

<div class="module-list" attr-class='(Model.Data.Any(x => x.IsEditable), "sortable-list")'>
    @foreach (var item in Model.Data)
    {
        <div class="module-item card shadow-sm sortable-item" attr-class='(!IsActive(item), "inactive")' data-system-name="@item.SystemName" data-friendly-name="@item.FriendlyName">
            <div sm-if="item.IsEditable" class="sortable-grip rounded-left"></div>
            
            <!-- Body -->
            <div class="card-body">
                <!-- Icon -->
                <div class="module-icon">
                    <img class="icon img-responsive" src="@Url.Content(item.IconUrl)" />
                </div>

                <!-- Data -->
                <div class="module-data">
                    <div class="module-title">
                        <div class="module-name">@(item.FriendlyName.NullEmpty() ?? item.SystemName)</div>
                        <div class="module-id small text-truncate">
                            <!-- SysName -->
                            @{
                                string tip = item.ProvidingModuleFriendlyName.HasValue() ? T("Admin.Providers.ProvidingPlugin") + ": " + item.ProvidingModuleFriendlyName : string.Empty;
                            }
                            <span class="fwn">@T("Admin.Common.Entity.Fields.Id"):</span>
                            <span class="text-muted text-truncate" attr-title='(tip.HasValue(), tip)'>@item.SystemName</span>
                        </div>
                    </div>

                    <div sm-if="item.Description.HasValue()" class="module-description">
                        @item.Description
                    </div>

                    @if (Model.InfoTemplate != null)
                    {
                        @RenderTemplate(Model.InfoTemplate(item))
                    }
                </div>
            </div>

            <!-- Footer -->
            <div class="card-footer">
                <!-- Badges -->
                <div class="module-icon align-items-center">
                    @{
                        await ActiveLabel(item);
                    }
                </div>

                <div class="module-commands">
                    <!-- Button -->
                    @if (Model.ButtonTemplate != null)
                    {
                        @RenderTemplate(Model.ButtonTemplate(item))
                    }
                    else if (item is IActivatable activatable)
                    {
                        <a class="activate-provider btn btn-sm btn-@(activatable.IsActive ? "outline-secondary btn-to-danger" : "success")"
                           data-href='@Url.Action("ActivateProvider")' href="javascript:;" data-systemname="@item.SystemName" data-activate="@(!activatable.IsActive ? "true" : "false")">
                            <bootstrap-icon name="check-lg" attr-class='(activatable.IsActive, "d-none")' />
                            <span>@T("Admin.Common.{0}".FormatInvariant(activatable.IsActive ? "Deactivate" : "Activate"))</span>
                        </a>
                    }

                    <!-- Actions dropdown -->
                    <div sm-if="item.IsEditable || item.IsConfigurable" class="module-actions dropdown">
                        <button class="btn btn-light btn-flat btn-sm btn-icon dropdown-toggle" type="button" data-toggle="dropdown">
                            <i class="fa fa-cog"></i>
                        </button>
                        <div class="dropdown-menu dropdown-menu-right">
                            @if (item.IsEditable)
                            {
                                if (item.IsPaymentMethod)
                                {
                                    <a class="dropdown-item" href='@Url.Action("Edit", "Payment", new { systemName = item.SystemName })'>
                                        <i class="far fa-fw fa-edit"></i>
                                        <span>@T("Admin.Common.Edit")</span>
                                    </a>
                                }
                                else
                                {
                                    <a class="dropdown-item module-edit" href='@Url.Action("EditProviderPopup", "Module", new { systemName = item.SystemName, btnId = "btnRefresh" })'>
                                        <i class="far fa-fw fa-edit"></i>
                                        <span>@T("Admin.Common.Edit")</span>
                                    </a>
                                }
                            }
                            @if (item.IsConfigurable)
                            {
                                <a class="dropdown-item module-configure" href="@Url.Action("ConfigureProvider", "Module", new { systemName = item.SystemName })">
                                    <i class="fa fa-fw fa-cog"></i>
                                    <span>@T("Admin.Common.Configure")</span>
                                </a>
                            }
                        </div>
                    </div>
                </div>
            </div>
        </div>
    }
</div>

<button type="button" id="btnRefresh" class="d-none"></button>

<script sm-target-zone="scripts" data-origin="_Providers">
    window.Res.Provider = {
	    @foreach (var res in clientRes) {<text>"@(Html.Raw(res.Key))": @Html.Raw(res.Value.EncodeJsString()),</text>}
    };

	$(function () {
        window.providerListInit(".provider-list");

		$('.module-list').on('click', '.module-edit', function (e) {
			e.preventDefault();
			openPopup($(this).attr("href"));
			return false;
		});

		$('#btnRefresh').on('click', function () {
			// reload page
			setLocation(location.href);
			return false;
        });

		$('.sortable-list').sortable({
            handle: '.sortable-grip',
			ghostClass: 'sortable-ghost',
            animation: 150
        }).on('sort', function (e, ui) {

			var items = $(this).closest('.sortable-list').find('.module-item');
			var newOrder = [];
			$.each(items, function (i, val) {
				newOrder.push($(val).data('system-name'));
			});
			$.ajax({
				async: false,
				cache: false,
				type: 'POST',
				//dataType: 'json',
				url: '@Url.Action("SortProviders", "Module")',
				data: { providers: newOrder.join(",") }
			});
		});
	});
</script>